<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	//id가 btn 인 버튼에 클릭 이벤트 핸들러를 추가
	$("#btn").on("click", function(){
		$.ajax({
			"url":"${initParam.rootPath}/member/searchMemberById_ajax.do",//요청 url
			"data":{"id":$("#cust_id").val()},//요청파라미터
			"type":"post",//요청방식
			"dataType":"json",//응답 데이터의 타입
			"success":function(data){
				
				//정상 응답이 왔을때 호출된 함수 설정.-매개변수 : 서버가 응답한 Data를 
				//받을 변수
				var str = data.result.id+" - "+data.result.name+" - "+data.result.age;
				$("#result_layer").html(str);
				
			}
		});
	});
	
	$("#btn2").on("click", function(){
		$.ajax({
			"url":"${initParam.rootPath}/member/searchMemberById_ajax2.do",//요청 url
			"data":{"id":$("#cust_id").val()},//요청파라미터
			"type":"post",//요청방식
			"dataType":"json",//응답 데이터의 타입
			"success":function(data){
				
				//정상 응답이 왔을때 호출된 함수 설정.-매개변수 : 서버가 응답한 Data를 
				//받을 변수
				var str = data.id+" - "+data.name+" - "+data.age;
				$("#result_layer").html(str);
				
			}
		});
	});
});

</script>
</head>
<body>
조회할 고객 ID <input type="text" id="cust_id"> 
<button id="btn">고객조회</button><p>
<button id="btn2">고객조회 - @ResponseBody 사용</button><p>
<div id="result_layer"></div>
</body>
</html>







